<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />
	<link rel="stylesheet" href="../css/refund.css" />
</head>
<body class="white">
	<div class="mui-content loading" id="vueMain">
	    <div class="mui-clearfix sel-date">
	    		<div class="mui-pull-right" id="set"><img src="../icon/date@2x.png" alt="" /></div>
	    		<div class="mui-pull-left">
	    			<h3>{{dateTime}}</h3>
	    			<p><span id="ctxt">退款</span>¥ {{count()}}</p>
	    		</div>
	    </div>
	   	<ul class="mui-table-view">
	   		<div v-if="list.length==0">
	   			<p style="text-align: center;padding:50px 0">这个月,什么都没有!</p>
	   		</div>
	   		<template v-else v-for="item in list">
		   	    <li class="mui-table-view-cell mui-media"> 
		   	        <a href="javascript:;">
		   	            <div class="mui-pull-right">{{item.money}}</div>
		   	            <img class="mui-media-object mui-pull-left" :src="item.img">
		   	            <div class="mui-media-body">
			   	            	 <p class="mui-ellipsis">{{item.name}}</p>
			   	            	 <p class="mui-ellipsis">订单:{{item.order_no}}</p>
			   	            	<p class="mui-ellipsis">{{item.time}}</p>
		   	            </div>
		   	        </a>
		   	    </li>
	   	   </template>
	   	</ul>
	</div>
<script src="../js/mui.js"></script>
<script src="../js/vue.min.js"></script>
<script src="../js/mui.picker.min.js"></script>
<script src="../js/bexta.js"></script>
<script type="text/javascript">
	var apps, views, user;
	mui.init();
	mui.plusReady(function () {
	   views = bexta.getWebview();
	   user = bexta.getStorage(USER);
	   var d = bexta.getDate([new Date().getTime()])[0].fullDate.split('-');
	   bexta.ajax(api.logs, function(res){
	   		initVue(res, d);
	   }, {data:{
	   		uid:user.uid,
	   		type:views.type
	   }})
	});
	function initVue(res,d){
		apps = new Vue({
			el:"#vueMain",
			data:{
				dateTime:d[0]+'年'+d[1]+"月",
				list:res
			},
			methods:{
				count:function(){
					if( this.list.length == 0 ){
						return 0;
					}else{
						var coun = 0;
						mui.each(this.list, function(){
							coun += parseInt(this.money);
						});
						return coun + '.00';
					}
				}
			},
			mounted:function(){
				document.querySelector('.loading').classList.add('loadRun');
				document.querySelector('#ctxt').innerHTML = views.type == 1?"共退款":"共支付";
				var set = document.querySelector('#set');
				var picker = new mui.DtPicker({
						type:"month",
						endDate:new Date()
					});
				set.addEventListener('tap', function() {
					picker.show(function(re) {
						var f = re.text.split('-');
						apps.dateTime = f[0]+'年'+f[1]+"月";
						bexta.ajax(api.logs, function(res){
					   		apps.list = res;
					   }, {data:{
					   		uid:user.uid,
					   		type:views.type,
					   		month:re.text
					   }})
					});
				});
			}
		})
	}
	
</script>
</body>
</html>